<div ng-controller="weixinCtrl">
	<!-- help -->
	<p class="help-wx">
		<i class="fa fa-info-circle fa-fw"></i>&{'weixin.form.notice.1'}
	</p>
	<!-- /help -->
	
	<!-- form -->
	<div class="panel panel-default">
		<div class="panel-heading">&{'weixin.form.caption'}</div>
		<div class="panel-body">
			<form name="wxForm" id="weixin-data-form" action="#" method="post" class="form-horizontal form-wx" novalidate>
				<!-- name -->
				<div class="form-group" ng-class="hasError(wxForm.name)">
					<label for="name" class="col-sm-2 control-label"><strong>*</strong>&{'weixin.form.name'}</label>
					<div class="col-sm-4">
						<input id="name" name="name" type="text" class="form-control" autofocus ng-model="weixin.name" required ng-maxlength="20">
						<p class="help-block fade-animate" ng-if="isError(wxForm.name, 'required')"><i class="fa fa-exclamation-triangle"></i> &{'weixin.form.name.failure.required'}</p>
						<p class="help-block fade-animate" ng-if="isError(wxForm.name, 'maxlength')"><i class="fa fa-exclamation-triangle"></i> &{'weixin.form.name.failure.maxlength'}</p>
					</div>
				</div>
				<!-- /name -->
				
				<!-- original code -->
				<div class="form-group" ng-class="hasError(wxForm.originalCode)">
					<label for="originalCode" class="col-sm-2 control-label"><strong>*</strong>&{'weixin.form.original.code'}</label>
					<div class="col-sm-4">
						<input id="originalCode" name="originalCode" type="text" class="form-control" ng-model="weixin.originalCode" required>
						<p class="help-block fade-animate" ng-if="isError(wxForm.originalCode, 'required')"><i class="fa fa-exclamation-triangle"></i> &{'weixin.form.original.code.failure.required'}</p>
					</div>
				</div>
				<!-- /original code -->
				
				<!-- code -->
				<div class="form-group" ng-class="hasError(wxForm.code)">
					<label for="code" class="col-sm-2 control-label"><strong>*</strong>&{'weixin.form.code'}</label>
					<div class="col-sm-4">
						<input id="code" name="code" type="text" class="form-control" ng-model="weixin.code" required>
						<p class="help-block fade-animate" ng-if="isError(wxForm.code, 'required')"><i class="fa fa-exclamation-triangle"></i> &{'weixin.form.code.failure.required'}</p>
					</div>
				</div>
				<!-- /code -->
				
				<!-- type -->
				<div class="form-group" ng-class="hasError(wxForm.type)">
					<label class="col-sm-2 control-label"><strong>*</strong>&{'weixin.form.type'}</label>
					<div class="col-sm-10 radio">
						#{list items: types, as: 't'}
						<label><input name="type" value="${t.key}" type="radio" ng-model="weixin.type" required>${t.value}</label>
						#{/list}
						<p class="help-block fade-animate" ng-if="isError(wxForm.type, 'required')"><i class="fa fa-exclamation-triangle"></i> &{'weixin.form.type.failure.required'}</p>
					</div>
				</div>
				<!-- /type -->
				
				<!-- app id -->
				<div class="form-group" ng-class="hasError(wxForm.appId)">
					<label for="appId" class="col-sm-2 control-label"><strong>*</strong>&{'weixin.form.app.id'}</label>
					<div class="col-sm-4">
						<input id="appId" name="appId" type="text" class="form-control" ng-model="weixin.appId" required>
						<p class="help-block fade-animate" ng-if="isError(wxForm.appId, 'required')"><i class="fa fa-exclamation-triangle"></i> &{'weixin.form.app.id.failure.required'}</p>
					</div>
				</div>
				<!-- /app id -->
				
				<!-- app secret -->
				<div class="form-group" ng-class="hasError(wxForm.appSecret)">
					<label for="appSecret" class="col-sm-2 control-label"><strong>*</strong>&{'weixin.form.app.secret'}</label>
					<div class="col-sm-4">
						<input id="appSecret" name="appSecret" type="text" class="form-control" ng-model="weixin.appSecret" required>
						<p class="help-block fade-animate" ng-if="isError(wxForm.appSecret, 'required')"><i class="fa fa-exclamation-triangle"></i> &{'weixin.form.app.secret.failure.required'}</p>
					</div>
				</div>
				<!-- /app secret -->
				
				<!-- div class="form-group">
					<label for="aesKey" class="col-sm-2 control-label">消息密钥</label>
					<div class="col-sm-6">
						<input id="aesKey" name="aesKey" type="text" class="form-control" ng-model="weixin.aesKey">
					</div>
				</div -->
				
				<!-- server url -->
				<div class="form-group">
					<label class="col-sm-2 control-label">&{'weixin.form.server.url'}</label>
					<div class="col-sm-6">
						<input type="text" value="@@{Server.check}" class="form-control" readonly>
					</div>
				</div>
				<!-- /server url -->
				
				<!-- server token -->
				<div class="form-group">
					<label class="col-sm-2 control-label">&{'weixin.form.server.token'}</label>
					<div class="col-sm-2">
						<input type="text" value="${play.configuration.get('application.token')}" class="form-control" readonly>
					</div>
				</div>
				<!-- /server token -->
				
				<!-- button & hidden -->
				<div class="form-group">
					<div class="col-sm-offset-2 col-sm-10">
						<button id="save-btn" type="button" class="btn btn-success" ng-disabled="btnDisabled()" ng-click="save()">
							<span ng-if="btn(['loading'])"><i class="fa fa-spinner fa-spin"></i> &{'app.common.button.loading'}</span>
							<span ng-if="btn(['doing'])"><i class="fa fa-spinner fa-spin"></i> &{'app.common.button.doing'}</span>
							<span ng-if="btn(['wait'])">&{'app.common.button.save'}</span>
						</button>
					</div>
				</div>
				<!-- /button & hidden -->
			</form>
		</div>
	</div>
	<!-- /form -->
</div>

<script type="text/javascript">
'use strict'
var weixinCtrl = ['$scope', '$http', function($scope, $http) {
	// 定义方法
	angular.extend($scope, {
		// 初始化控制器
		// 加载数据
		init: function() {
			$scope.btn('loading');
			$http({
				method: 'get',
				url: '@{Weixins.current}',
			}).success(function(data) {
				$scope.weixin = data;
				$scope.btn('wait');
			});
		}, 
		
		// 保存数据
		save: function() {
			$scope.btn('doing');
			$http({
				method: 'post',
				url: '@{Weixins.save}',
				data: $.param($scope.weixin),
				headers: {'Content-Type': 'application/x-www-form-urlencoded'}
			}).success(function(data) {
				$scope.btn('wait');
			});
		},
		
		// 判断按钮是否有效
		// 当表单有无效数据项时按钮不可用
		// 当加载数据和保存数据时按钮不可用
		btnDisabled: function() {
			return ($scope.wxForm.$invalid || $scope.btn(['loading', 'doing']));
		}
	});
	
	// 初始化
	$scope.init();
}];
</script>
